// ======================
// H5 移动端 Markdown 适配
// 版本：2.1-mobile
// ======================

$markdown-mobile-text: #333;
$markdown-mobile-breakpoint: 768px;

.markdown {
  // ===== 基础重置 =====
  font-size: var(--global-font-size);
  line-height: 1.6;

  // ===== 移动端标题 =====
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    line-height: 1.3;

    &::before {
      left: -1em;
      font-size: 0.8em;
    }
  }

  h1 {
    font-size: 1.6em !important;
    border-bottom-width: 1px;
  }

  h2 {
    font-size: 1.4em !important;
    border-bottom-width: 1px;
  }

  h3 {
    font-size: 1.2em !important;
  }
  h4 {
    font-size: 1.1em !important;
  }
  h5 {
    font-size: 1em !important;
    color: #666 !important;
  }

  // ===== 移动端段落 =====
  p {
    margin: 0 !important;
    line-height: 1.7;
  }

  // ===== 移动端列表 =====
  ul,
  ol {
    padding-left: 1.2em;

    li {
      margin: 0;
      padding-left: 0.3em;
    }
  }

  // ===== 移动端表格 =====
  table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    margin: 1em -15px;
    width: calc(100% + 30px);

    th,
    td {
      min-width: 80px;
      padding: 8px 10px !important;
      font-size: 0.9em;
    }
  }

  // ===== 移动端代码块 =====
  pre {
    margin: 0.8em -15px;
    padding: 12px;
    border-radius: 0;

    code {
      font-size: 14px;
    }
  }

  // ===== 图片优化 =====
  img {
    margin: 0.8em 0;
    border-radius: 4px;
  }

  // ===== 移动端专属媒体查询 =====
  @media (max-width: $markdown-mobile-breakpoint) {
    font-size: 15px;

    blockquote {
      margin-left: -10px;
      margin-right: -10px;
      padding: 10px;
    }

    // 隐藏复杂装饰
    h1::before,
    h2::before {
      display: none;
    }
  }
}
